<template>
	<view class="management">
		<navbar ref="navbar" :config="config" backColor="#000000"></navbar>
		
		<!-- 先注释 -->
		
		<view class="top" @click="goToEdit">
			<view class="image" style="width: 81rpx;height: 81rpx;">

				<image v-if="userInfo.head_photo" :src="userInfo.head_photo" mode=""></image>
				<!-- <image v-else :src="imgUrl+'/head-on.png'" mode=""></image> -->
				<image v-else :src="imgUrl+'/personal/head.png'"class="logoImage" style="width: 81rpx;height: 81rpx;"></image>
			</view> 
			<view class="name-and-num">
				<div>
					<view class="name">
						{{userInfo.real_name}}
					</view>
					<view class="num u-text1">
						{{userInfo.mobile}}
					</view>
				</div>
				<image :src="imgUrl+'/set/right.png'" class="right"></image>
			</view>

		</view>
		<!-- <view class="distance">

		</view> -->
		<view class="content">
			<!-- 			<view class="modify" @click="goToModifyPass">
				<view class="password">
					修改密码
				</view>
				<view class="modif-name">

					<text class="iconfont">&#xe6c7;</text>
				</view>
			</view>
			<view class="modify" @click="goToForgetPass">
				<view class="password">
					忘记密码
				</view>
				<view class="modif-name">

					<text class="iconfont">&#xe6c7;</text>
				</view>
			</view> -->
		</view>
		<!-- <view class="distance">

		</view> -->
		
		
	<!-- 	<view class="address">
			<view class="item" @click="goToReplacePhone">
				<view class="u-474747 my-address">
					更换手机号
				</view>
				<view class="iconfont">&#xe6c7;</view>
			</view>
		</view> -->
		
		<view class="setItem" @click="goToReplacePhone">
			<view class="left">
				<image :src="imgUrl+'/personal/one.png'"></image>
				<view>更换手机号</view>
			</view>
			<image :src="imgUrl+'/set/right.png'" class="right"></image>
		</view>
		
		<view class="setItem" @click="goPayPassword()">
			<view class="left">
				<image :src="imgUrl+'/personal/two.png'"></image>
				<view>设置支付密码</view>
			</view>
			<image :src="imgUrl+'/set/right.png'" class="right"></image>
		</view>
		
		<view class="setItem"  @click="goAgreement()">
			<view class="left">
				<image :src="imgUrl+'/set/four.png'"></image>
				<view>关于我们</view>
			</view>
			<image :src="imgUrl+'/set/right.png'" class="right"></image>
		</view>
		
		<view class="setItem" @click="getUserInfo('examine')">
			<view class="left">
				<image :src="imgUrl+'/set/five.png'"></image>
				<view>检查更新</view>
			</view>
			<view class="u-flex">
				<view class="c_blue" v-if="userInfo.check_latest_ver">有新版本</view>
				<view class="" v-else>{{userInfo.ver}}</view>
				<image :src="imgUrl+'/set/right.png'" class="right"></image>
			</view>
			
		</view>
		
		
		
		
		<!-- 先注释 -->
		<!-- <view class="address">
			<view class="item" @click="goToReplacePhone">
				<view class="u-474747 my-address">
					更换手机号
				</view>
				<view class="iconfont">&#xe6c7;</view>
			</view>
		</view>
		<view class="address" @click="goPayPassword()">
			<view class="item">
				<view class="u-474747 my-address">
					设置支付密码
				</view>
				<view class="iconfont">&#xe6c7;</view>
			</view>

		</view>
		<view class="address" @click="goLogout()">
			<view class="item">
				<view class="u-474747 my-address">
					注销账户
				</view>
				<view class="iconfont">&#xe6c7;</view>
			</view>
		</view> -->
		<!-- 先注释 -->
		
		
		
		
		
		
		
		
		
		
		<!-- <view class="address" @click="addBamks()">
    	<view class="item">
    		<view class="my-address">
    			管理银行卡
    		</view>
    		<view class="iconfont">&#xe6c7;</view>
    	</view>
    
    </view> -->
		<!-- <view class="address">
			<view class="item" @click="goToAddressList">
				<view class="my-address">
					我的地址
				</view>
				<view class="iconfont">&#xe6c7;</view>
			</view>

		</view> -->
		
		
			<!-- <view class="item" @click="swithcWeChat">
				<view class="my-address">
					绑定微信
				</view>
				<view class="u-flex">
					<view class="c_gary" v-if="userInfo.bind_wechat">已绑定</view>
					<view class="iconfont">&#xe6c7;</view>
				</view>
			</view>
			<view class="item" @click="switchAlipay()">
				<view class="my-address">
					绑定支付宝
				</view>
				<view class="u-flex">
					<view class="c_gary" v-if="userInfo.bind_alipay">已绑定</view>
					<view class="iconfont">&#xe6c7;</view>
				</view>
			</view> -->
		<!-- <view class="address">
			<view class="item" @click="goAboutLd">
				<view class="my-address">
					加入我们
				</view>
				<view class="iconfont">&#xe6c7;</view>
			</view>
			<view class="item" @click="goAboutUs">
				<view class="my-address">
					关于惠选中亿平台
				</view>
				<view class="iconfont">&#xe6c7;</view>
			</view>
		</view> -->
		<!-- <view class="footer">
		<view>
		Copyright@2021-2030	</view>
		<view>广东惠选中亿平台生物科技有限公司 版权所有
		</view>
		</view> -->
		<view class="sign">
			<view class="sign-out" @click="logOut">
				退出登录
			</view>
		</view>
		<u-modal v-model="show" content="确定解除绑定？" show-cancel-button @confirm="unbinding"></u-modal>
	</view>
</template>

<script>
	import {
		myInfo,
		logout
	} from "@/api/login.js"
	export default {
		data() {
			return {
				config: {
					back: true, //false是tolbar页面 是则不写
					title: '设置',
					color: '#000',
					//背景颜色;参数一：透明度（0-1）;参数二：背景颜色（array则为线性渐变，string为单色背景）
					backgroundColor: [1, "#fff"],
					statusBarFontColor: '#1A1A1A',
					backIconColor: "#000"

				},

				userInfo: {}, //个人信息
				imgUrl: this.$mConfig.staticUrl,
				code: null,
				AlipayCode: null,
				versionCode: 0, //版本号
				show: false,
				type: null,
				AlipayType: 1, //2获取支付宝code  1不获取 
			}
		},
		onShow() {
			// #ifdef APP-PLUS
			plus.runtime.getProperty(plus.runtime.appid, (info) => {
				this.versionCode = info.versionCode;
				this.getUserInfo()
				this.getAlipay()
			})
			// #endif
			// #ifndef APP-PLUS
			this.getUserInfo()
			// #endif
			this.getToken()
		},
		methods: {
			// 支付宝授权回调
			getAlipay() {
				var args = plus.runtime.arguments;
				let argsUrl = decodeURIComponent(args.split('?')[1]).split('=')[1];
				if (argsUrl && !this.userInfo.bind_alipay && this.AlipayType == 2) {
					// 处理args参数，如直达到某新页面等    
					// plus.runtime.arguments = {};
					// uni.redirectTo({
					// 	url: "/pages/login/login?code=" + argsUrl.code
					// });
					this.AlipayType = 1
					this.code = argsUrl
					this.binding(1)
				}
			},
			getToken() {
				let token = uni.getStorageSync("token")
				if (!token) {
					uni.redirectTo({
						url: "../../index/personal"
					})
				}
			},
			goAboutUs() {
				uni.navigateTo({
					url: "../homepage/about-us-list"
				})
			},
			goAboutLd() {
				uni.navigateTo({
					url: "../homepage/aboutLida"
				})
			},
			goLogout() {
				uni.navigateTo({
					url: "/pages/research/setup/logout"
				})
			},
			// 跳转协议
			goAgreement() {
				uni.navigateTo({
					url: "/pages/protocol/index?code=about-us"
				})
			},
			// 绑定/解绑 微信
			swithcWeChat() {
				if (this.userInfo.bind_wechat) {
					this.show = true;
					this.type = 0;
					return
				}
				let that = this;
				// uni.getProvider({
				// 	service: 'oauth',
				// 	success: function (res) {
				// 		console.log(res.provider)
				// 	}
				// });
				uni.login({
					provider: 'weixin',
					onlyAuthorize: true,
					success: function(loginRes) {
						that.code = loginRes.code
						that.binding(0)
					},
					complete(e) {
						console.log(e)
					}
				});
			},
			// 绑定 支付宝
			switchAlipay() {
				if (this.userInfo.bind_alipay) {
					this.show = true;
					this.type = 1;
					return
				}
				this.code = null;
				// let urls =
				// 	`https://openauth.alipay.com/oauth2/publicAppAuthorize.htm?app_id=${this.$mConfig.AlipayAppid}&scope=auth_userinfo&redirect_uri=${this.$mConfig.redirect_uri}/pages/login`;
				// urls = encodeURIComponent(urls); //将地址编码成浏览器访问的格式
				// this.AlipayType = 2
				// // 判断平台
				// if (plus.os.name == 'Android') {
				// 	plus.runtime.openURL(
				// 		'alipays://platformapi/startapp?appId=20000067&url=' + urls,
				// 		res => {
				// 			//这里写打开URL地址失败后的处理
				// 			uni.showModal({
				// 				content: '本机未检测到对应客户端，是否打开浏览器访问页面？',
				// 				success: function(res) {
				// 					if (res.confirm) {
				// 						//plus.runtime.openURL();
				// 					}
				// 				}
				// 			});
				// 		},
				// 		'com.eg.android.AlipayGphone'
				// 	);

				// } else if (plus.os.name == 'iOS') {
				// plus.runtime.openURL(
				// 	'alipay://platformapi/startapp?appId=20000067&url=' + urls,
				// 	res => {
				// 		console.log(res);
				// 		uni.showModal({
				// 			content: '本机未检测到对应客户端，是否打开浏览器访问页面？',
				// 			success: function(res) {
				// 				if (res.confirm) {
				// 					//plus.runtime.openURL(url);
				// 				}
				// 			}
				// 		});
				// 	},
				// 	'com.eg.android.AlipayGphone'
				// );
				// }
				let str = encodeURIComponent(
					'apiname=com.alipay.account.auth&app_id=2021003145626363&app_name=mc&auth_type=AUTHACCOUNT&biz_type=openservice&method=alipay.open.auth.sdk.code.get&pid=2088441816745635&product_id=APP_FAST_LOGIN&scope=kuaijie&sign_type=RSA2&target_id=lvzv2022'
				)
				let alipayLogin = uni.requireNativePlugin("henter-alipay-login")
				alipayLogin.login({
						authInfo: 'apiname=com.alipay.account.auth&app_id=2021003145626363&app_name=mc&auth_type=AUTHACCOUNT&biz_type=openservice&method=alipay.open.auth.sdk.code.get&pid=2088441816745635&product_id=APP_FAST_LOGIN&scope=kuaijie&sign_type=RSA2&target_id=lvzv2022&sign=' +
							str,
						appScheme: 'lmzc'
					},
					(r) => {
						console.log(r)
						if (r.resultStatus == 9000) {
							let arr = r.result.split("&");
							for (let i = 0; i < arr.length; i++) {
								let pair = arr[i].split("=");
								if (pair[0] == 'auth_code') {
									this.code = pair[1]
									this.binding(1)
								}
							}
						}
					}
				)
			},
			// 绑定
			binding(type) {
				let param = {
					third_type: type,
					code: this.code
				}
				this.$http.post('/account/userthirdidentity/binding', param).then(res => {
					console.log(res)
					if (res && res.code == 200) {
						uni.showToast({
							title: '绑定成功！',
							duration: 2000
						});
						this.getUserInfo()
					}
				}).catch(e => {
					console.log(e)
				})
			},
			// 解绑
			unbinding() {
				let param = {
					third_type: this.type,
				}
				this.$http.post('/account/userthirdidentity/unbind', param).then(res => {
					if (res && res.code == 200) {
						uni.showToast({
							title: '解绑成功！',
							duration: 2000
						});
						this.getUserInfo()
					}
				})
			},
			//退出登录
			logOut() {
				let that = this
				let userInfo = uni.getStorageSync("token")
				uni.showModal({
					title: '你确定要退出吗？',
					success: function(res) {
						if (res.confirm) {
							that.$http.post(logout)
								.then(res => {
									if (res && res.code == 200) {
										uni.removeStorageSync('token');
										that.end();
										that.$mUtil.toast("退出成功")
										uni.navigateTo({
											url: "../register/login"
										})
									}
								})
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					},
				});
			},
			// 关闭im
			async end() {
				// @ts-ignore
				console.log(uni.$UIKitNIM.nim)
				await uni.$UIKitNIM.nim.disconnect()
				// // @ts-ignore
				await uni.$UIKitNIM.nim.destroy();
			},
			//获取个人信息
			getUserInfo(type) {
				// myInfo
				// /account/center/setting/info
				this.$http.get('/account/center/setting/info', {
					number: this.versionCode
				}).then(res => {
					if (res.code == 200) {
						this.userInfo = res.data;
						if (type && this.userInfo.check_latest_ver) {
							uni.navigateTo({
								url: "/pages/protocol/versionUpgrade"
							})
						} else if (type && !this.userInfo.check_latest_ver) {
							uni.showToast({
								icon: "none",
								title: '已是最新版本！',
								duration: 2000
							});
						}
					}
				})
			},
			// //获取更新信息
			// getUpdataInfo(){
			// 	this.$http.get('')
			// },
			//跳转设置页
			goToEdit() {
				uni.navigateTo({
					url: "./edit"
				})
			},
			//忘记密码
			goToForgetPass() {
				uni.navigateTo({
					url: "./forgetPass"
				})

			},
			//跳转我的地址
			goToAddressList() {
				uni.navigateTo({
					url: "../../user/address/addressList"
				})
			},
			//修改密码
			goToModifyPass() {
				uni.navigateTo({
					url: "./modifyPass"
				})
			},
			goToReplacePhone() {
				uni.navigateTo({
					url: "../register/replacePhone"
				})
			},
			goPayPassword() {
				uni.navigateTo({
					url: "../pay-password"
				})
			},
			addBamks() {
				uni.navigateTo({
					url: '/pages/order/banks/list'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #ffffff;
	}

	.footer {
		margin-top: 500rpx;
		text-align: center;
	}

	.management {
		position: relative;
	}

	// .sign {
	// 	display: flex;
	// 	justify-content: center;

	// 	.sign-out {
	// 		margin-top: 430rpx;
	// 		font-size: 36rpx;
	// 		color: #ffffff;
	// 		font-weight: 400;
	// 		padding: 18rpx 272rpx;
	// 		background-color: #FF721B;
	// 		border-radius: 20rpx;

	// 	}
	// }
	.sign {
		width: 100%;
		position: fixed;
		bottom: 100rpx;

		.sign-out {
			text-align: center;
			width: 673rpx;
			height: 88rpx;
			border-radius: 19rpx 19rpx 19rpx 19rpx;
			border: 2rpx solid #999999;
			font-size: 29rpx;
			color: #999999;
			line-height: 40rpx;
			display: flex;
			flex-direction: row;
			justify-content: center;
			align-items: center;
			margin:0 auto;
		}
	}


	.address {
		padding: 0 30rpx;
		margin: 20rpx 60rpx;
		border-bottom: 1rpx solid #e6e6e6;

		.item {
			display: flex;
			justify-content: space-between;
			// border-bottom: 1rpx solid #E6E6E6;
			padding-bottom: 30rpx;
			padding-top: 23rpx;
			font-size: 28rpx;
			color: #1A1A1A;
			font-weight: 400;
		}

	}

	.content {
		padding: 0 30rpx;

		.modify:last-child {
			border-bottom: none;
		}

		.modify {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-top: 22rpx;
			padding-bottom: 30rpx;
			border-bottom: 1rpx solid #E6E6E6;

			.password {
				font-size: 28rpx;
				color: #1A1A1A;
				font-weight: 400;
			}

			.modif-name {
				font-size: 28rpx;
				font-weight: 400;
				color: #474747;

				.iconfont {
					margin-left: 14rpx;
				}
			}
		}
	}

	.distance {
		height: 10rpx;
		background-color: #F5F5F5;
	}

	.top {
		// display: flex;
		// align-items: center;
		// // padding: 0 30rpx;
		// // margin: 45rpx 0 40rpx 0;
		// padding: 30rpx 30rpx;
		// margin: 20rpx 60rpx 20rpx 60rpx;
		// border-bottom: 1rpx solid #e6e6e6;
		width: 750rpx;
		height: 123rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		padding-top:19rpx;
		padding-bottom: 19rpx;
		padding-left: 38rpx;
		padding-right: 38rpx;
		box-sizing: border-box;

		.image {
			image {
				width: 85rpx;
				height: 85rpx;
				border-radius: 50%;
				margin-right: 28rpx;
			}
		}

		.name-and-num {
			margin-left: 18rpx;
			flex: 1;
			display: flex;
			justify-content: space-between;
			align-items: center;
			width: 572rpx;

			.name {
				overflow: hidden;
				white-space: nowrap;
				text-overflow: ellipsis;
				width: 300rpx;
				font-size: 28rpx;
				color: #474747;
				padding-bottom: -5rpx;
				// font-weight: 400;
			}

			.num {
				font-size: 28rpx;
				color: #AAAAAA;
				padding-top: 15rpx;
				// font-weight: 500;

			}
		}
	}

	.c_gary {
		color: #808080;
	}

	.c_blue {
		color: #0071E2;
		margin-right: 20rpx;
	}

	.left_icon {
		color: #000;
	}

	.hx-navbar__icon {
		color: #000;
	}
	.setItem{
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		width: 750rpx;
		height: 85rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		padding-left: 38rpx;
		padding-right: 38rpx;
		box-sizing: border-box;
		.left{
			display: flex;
			flex-direction: row;
			justify-content: flex-start;
			align-items: center;
			image{
				width: 46rpx;
				height: 46rpx;
				margin-right: 19rpx;
			}
			view{
				font-weight: 400;
				font-size: 27rpx;
				color: #333333;
			}
		}
		
	}
	.hx-navbar__content__main_center{
		background-color: #fff;
	}
	page{
		background-color: #F5F5F5;
	}
	.logoImage{
		height: 81rpx !important;
		width: 81rpx !important;
	}
	.right{
		width: 11rpx;
		height: 23rpx;
	}
</style>